<template>
  <view class="flex-col page">
    <view class="flex-col group">
      <view class="flex-col section_2">
        <view class="justify-between">
          <text class="text_1">巡检工序</text>
          <text class="text_3">{{xunjian.processName}}</text>
        </view>
        <view class="justify-between group_2">
          <text class="text_5">巡检子工序</text>
          <text class="text_7">{{xunjian.childProcessName}}</text>
        </view>
        <view class="flex-col group_3">
          <view class="justify-between">
            <text class="text_9">预计完成时间</text>
            <text class="text_10">{{xunjian.expectedDate?xunjian.expectedDate:'---'}}</text>
          </view>
          <view class="justify-between group_5">
            <text class="text_11">实际施工进程</text>
            <text class="text_12">{{xunjian.actualProcess?xunjian.actualProcess:0}}%</text>
          </view>
        </view>
      </view>
      <view class="flex-col section_2 view_2">
        <view class="justify-between">
          <text class="text_1">预计下次巡检项目</text>
          <text class="text_3">{{xunjian.nextProcessName}}</text>
        </view>
        <view class="justify-between group_2">
          <text class="text_5 text_15">下次巡检时间</text>
          <text class="text_7 text_16">{{xunjian.nextInspectionDate?xunjian.nextInspectionDate:'---'}}</text>
        </view>
      </view>
      <view class="flex-col list" v-if="list.length>0">
        <view class="flex-col list-item" :key="i" v-for="(item, i) in list" >
          <view class="justify-between u-col-center">
            <view class="flex-row ">
              <text class="text_17">{{item.issueUserName}}</text>
              <view class="flex-col items-center text-wrapper"><text class="text_18">{{item.issueUserRoleName==104?'工长':'巡检员'}}</text></view>
            </view>
            <text class="text_19">{{item.rectificationStatus}}</text>
          </view>
          <text class="text_20">问题类型：{{item.issueTypeName}}</text>
		 
          <view class="flex-row u-flex-wrap equal-division">
            <image  v-for="(it,i) in item.issueMedia"
			 :src="it" 
              :class="i%3==0?'image_1':''"
              class="equal-division-item "
            />
           
          </view>
          <text class="text_21">{{item.issueContent}}</text>
          <view class="flex-row group_9">
            <text class="text_22">{{item.insertTime}}</text>

          </view>
        </view>
      </view>
      <view class="flex-col section_3 u-m-t-20">
		 
		  	<view class="flex-row group_18">
		  	  <view class="section_4"><!--*--></view>
		  	  <text class="text_40">我的评价</text>
		  	</view>
			 <view class="flex-col" v-if="xunjian.commentsLevel">
		  	<view class="justify-between group_19 u-col-center">
		  	  <view class="flex-row ">
		  	    <text class="text_41">评分:</text>
		  	    <text class="u-m-l-10 text_41 color-black" style="" v-if="xunjian.commentsLevel==1">非常满意</text>
				<text  class="u-m-l-10 text_41 color-black" v-if="xunjian.commentsLevel==2">满意</text>
				<text  class="u-m-l-10 text_41 color-black" v-if="xunjian.commentsLevel==3">一般</text>
				<text  class="u-m-l-10 text_41 color-black" v-if="xunjian.commentsLevel==4">不满意</text>
		  	  </view>
		  	  <text class="text_42">{{xunjian.commentsTime}}</text>
		  	</view>
		  	<text class="text_43">
		  	{{xunjian.commentsDetails}}
		  	</text>
		  	<view class="flex-row equal-division_2 u-flex-wrap" v-if="xunjian.commentsPictures.length>0">
				
		  	  <image v-for="(item,index) in  xunjian.commentsPictures"  :key="index" 
			  @click="imgListPreview(index) "
		  	  :src="item" 
		  	    class="equal-division-item_4 image_13"
		  	  />
			  
		  	  
		  	</view>
		  </view>
		  <view class="" v-else>
		  	<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
		  	</u-empty>
		  </view>
    
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    components: {},
	onLoad(option) {
		if(option.id)
		{
			this.id=option.id;
			this.getXunjian(this.id);
			this.getQuestion(this.id);
		}
	},
    data() {
      return {
        list: [],
        list_RGIkpGa0: [null, null],
		xunjian:{},
		xunjians:[]
      };
    },
    methods: {
				//预览图片
				imgListPreview(index){
					var urlList = []
					urlList.push(this.xunjians)  //push中的参数为 :src="item.img_url" 中的图片地址
					uni.previewImage({
						indicator:"number",
						loop:true,
						urls: urlList
					})
				},

		getXunjian(id)
		{
			this.$http('check.viewInspectionFrequency',{
				inspectionFrequencyId:id
			}).then(r=>{
				if(r.code==200)
				{
					this.xunjians= r.data.commentsPictures;
					this.xunjian=r.data;
					if(this.xunjian.commentsPictures)
					{
						this.xunjian.commentsPictures=this.xunjian.commentsPictures.split(',');
					}
					console.log(this.xunjian);
				}
			});
		},
		getQuestion(id)
		{
			this.$http('check.queryIssuesByUtil',{
				inspectionId:id
			}).then(r=>{
				if(r.code==200)
				{
					this.list=r.data;
					this.list.forEach(item=>{
						if(item.issueMedia)
						{
						item.issueMedia=item.issueMedia.split(',')
						}
					})
					console.log(this.list);
				}
			});
		}
	
	},
  };
</script>

<style scoped lang="scss">
  .section_2 {
    padding: 30rpx 22rpx 35rpx 24rpx;
    background-color: #ffffff;
    border-radius: 16rpx;
  }
  .equal-division-item_4 {
    margin-left: 10rpx;
    flex: 1 1 156rpx;
    border-radius: 16rpx;
    width: 156rpx;
    height: 156rpx;
  }
  .equal-division-item {
    margin-left: 15rpx;
  
    border-radius: 16rpx;
    width: 208rpx;
    height: 208rpx;
	margin-bottom: 20rpx;
  }
  .image_7 {
    margin: 4rpx 0 4rpx 8rpx;
    flex-shrink: 0;
    width: 26rpx;
    height: 25rpx;
  }
  .text_1 {
    color: #666666;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_3 {
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_5 {
    color: #666666;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_7 {
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .group_2 {
    margin-top: 39rpx;
  }
  .page {
    background-color: #f6f7f9ff;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100vh;
  }
  .section_1 {
    padding: 53rpx 31.5rpx 31rpx;
    background-color: #ffffff;
    border-bottom: solid 1rpx #eeeeee;
    position: relative;
  }
  .group {
    padding: 24rpx 24rpx 32rpx;
  }
  .image {
    position: absolute;
    left: 31.5rpx;
    bottom: 26.5rpx;
    width: 21rpx;
    height: 36rpx;
  }
  .text {
    color: #000000;
    font-size: 36rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 43rpx;
  }
  .view_2 {
    margin-top: 20rpx;
  }
  .list {
    padding: 20rpx 0;
  }
  .section_3 {
	 
    padding: 0 24rpx 32rpx;
    background-color: #ffffff;
    border-radius: 16rpx;
  }
  .group_3 {
    margin-top: 39rpx;
  }
  .list-item {
    padding: 29rpx 23rpx 34rpx 24rpx;
    background-color: #ffffff;
    border-radius: 16rpx;
  }
  .group_18 {
    padding: 29rpx 4rpx 32rpx;
    border-bottom: solid 1rpx #eeeeee;
  }
  .group_19 {
    margin-top: 36rpx;
  }
  .text_43 {
    margin-top: 35rpx;
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
    text-align: left;
  }
  .equal-division_2 {
    margin-top: 40rpx;
  }
  .group_5 {
    margin-top: 33rpx;
  }
  .text_15 {
    margin-bottom: 6rpx;
  }
  .text_16 {
    margin-top: 6rpx;
  }
  .text_20 {
    margin-top: 34rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .equal-division {
    margin-top: 33rpx;
  }
  .text_21 {
    margin-top: 30rpx;
    align-self: flex-start;
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .group_9 {
    margin-top: 28rpx;
  }
  .section_4 {
    margin-top: 12rpx;
    background-color: #1d6aff;
    border-radius: 3rpx;
    width: 6rpx;
    height: 28rpx;
  }
  .text_40 {
    margin-left: 18rpx;
    color: #333333;
    font-size: 32rpx;
    font-family: '.AppleSystemUIFont';
  
  }
  .text_42 {
    margin-right: 6rpx;
    margin-top: 3rpx;
    color: #999999;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .image_13 {
    margin-left: 0;
	width: 30%;
	margin-right: 15rpx;
	margin-bottom: 15rpx;
  }
  .text_9 {
    margin-bottom: 6rpx;
    color: #666666;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_10 {
    margin-top: 6rpx;
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_11 {
    margin-bottom: 6rpx;
    color: #666666;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_12 {
    margin-top: 6rpx;
    color: #1d6aff;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_19 {
    margin: 4rpx 0 7rpx;
    color: #ff371d;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .image_1 {
    margin-left: 0;
  }
  .text_22 {
    color: #666666;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .text_23 {
    margin-left: 10rpx;
    color: #666666;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .text_41 {
    color: #666666;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .color-black{
	  color: #000000;
  }
  .image_10 {
    margin: 4rpx 0 4rpx 6rpx;
  }
  .text_17 {
    margin-bottom: 6rpx;
    color: #333333;
    font-size: 32rpx;
    font-family: '.AppleSystemUIFont';
 
  }
  .text-wrapper {
    margin-left: 16rpx;
    margin-top: 8rpx;
    padding-bottom: 8rpx;
    flex-shrink: 0;
    border-radius: 18rpx;
    background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836968864021937.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 96rpx;
    height: 36rpx;
  }
  .text_18 {
    color: #1d6aff;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
  
  }
</style>